iT邦幫忙

0

Sass

  • 分享至 

  • xImage
  •  

主要管理CSS

sass寫在.sass檔案中,但透過"編譯"的方式轉成.css檔案
=>在html上還是用.css的檔名

格式:

Sass是一種程式語言,有兩種寫法:
1.SCSS(目前多數人用,且跟CSS寫法相似)
2.SASS(比較像後端寫法)

SCSS寫法:(以大括號來區別)

第一層{
    第二層{
        第三層{}
    }
}
header{
    h1{}
    li{
     a{}   
    }
}

SASS寫法:(以兩個空白鍵或一個TAB來區別,且樣式分號後面一定要一個空白且不能有分號結尾)

menu
  font-size: 32px
  a
    color: blue

編譯:

編譯方式有三種:
-編譯軟體
-gulp、webpack前端任務/打包工具
-編輯器內建的功能

Sass官網: https://sass-lang.com/install 裡面有提供兩種方式
1.軟體
2.Command Line

變數

$變數名稱: 樣式設定;

$font-lg: 36px;
header{
    h1{
        font-size:$font-lg;
    }
}

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言